import 'ant-design-vue/dist/antd.css'

// 导入自己需要的组件
import {
  notification,
  Button,
  Table,
  Form,
  Input,
  Pagination,
  Modal,
  message,
  Select,
  Steps,
  Checkbox,
  Radio,
  Tag,
  Switch,
  DatePicker,
  Tooltip,
  Transfer,
  Tree,
  Popconfirm,
  Dropdown,
  Menu,
  Drawer,
  Breadcrumb,
  Divider,
  Collapse,
  Spin,
  Layout,
  Tabs,
  Empty,
  Skeleton,
  TimePicker,
  Popover,
  Timeline,
  Result,
  Upload
} from 'ant-design-vue'

import type {App} from 'vue'

//对话框,属性destroyOnClose：关闭时是否销毁子元素,将默认属性改为true
Modal.props.destroyOnClose.default = true
Tabs.props.destroyInactiveTabPane.default = true
const components = [
  Upload,
  Result,
  Timeline,
  Popover,
  TimePicker,
  Skeleton,
  Empty,
  Tabs,
  Layout,
  Spin,
  Collapse,
  Divider,
  Breadcrumb,
  Drawer,
  Dropdown,
  Menu,
  Popconfirm,
  Tree,
  Transfer,
  Tooltip,
  DatePicker,
  Switch,
  Tag,
  Button,
  Table,
  Form,
  Input,
  Pagination,
  Modal,
  Select,
  Steps,
  Checkbox,
  Radio
]

const antDesignVue: any = {
  install: function (app: App<Element>) {
    // ant-design 组件注册
    components.forEach(component => {
      app.use(component)
    })

    app.config.globalProperties.$config = message.config
    app.config.globalProperties.$destroy = message.destroy
    app.config.globalProperties.$error = message.error
    app.config.globalProperties.$info = message.info
    app.config.globalProperties.$loading = message.loading
    app.config.globalProperties.$open = message.open
    app.config.globalProperties.$success = message.success
    app.config.globalProperties.$warn = message.warn
    app.config.globalProperties.$warning = message.warning
    app.config.globalProperties.$notification = notification
  }
}

export const ant_design_vue = {notification, message}

export default antDesignVue
